<div class="layui-fluid">
	<div class="layui-row">
		<div class="layui-col-xs12">
			<div class="layui-card fllextopbox">
				<div class="">
					<div class="layui-btn" id="addtypeid">添加来源</div>
				</div>
				<form class="layui-form" action="">
					<div class="layui-inline">
						<input type="text" class="layui-input" id="datavideo" placeholder="选择日期">
					</div>

					<div class=" tablesearch iconfont iconsousuo ">
						<input type="text" class="layui-input" id="tablesearchid" placeholder="请输入搜索关键字">
					</div>
				</form>
			</div>
			<table id="demo_hash" lay-filter="type_hash" lay-even lay-skin="nob"></table>
			<script type="text/html" id="barDemo_hash">
				<a class="layui-btn" lay-event="edit">编辑</a>
								<!-- <a class="layui-btn" lay-event="look">数据</a> -->
				<a class="layui-btn" lay-event="del">删除</a>
   </script>
		</div>
	</div>
</div>
<script type="text/html" id="toolbarDemo">
	<div class="toobarbox">
	<div class="layui-btn-container" >
    <button class="layui-btn " lay-event="addbtn">添加来源</button>
				
					<form class="layui-form layui-inline" action="">
						<div class="layui-inline">
							<input type="text" class="layui-input" id="datavideo" placeholder="选择日期">
						</div>
						<div class=" tablesearch iconfont iconsousuo ">
							<input type="text" class="layui-input" id="videokey" placeholder="请输入搜索关键字">
					</div>
					</form>	
    <!-- <button class="layui-btn layui-btn-primary" lay-event="delallbtn">删除选中</button> -->
  </div>
<!-- 		<div class="iconfont iconsousuo tablesearch">
			<input type="text" class="layui-input " id="tablesearchid" title="请输入搜索的关键字" placeholder="请输入搜索关键字">
	
		</div> -->
			</div>
</script>

<script>
	layui.config({
		base: '/src/js/'
	}).use(['jquery', 'mockjs', 'table', 'sidebar', 'form', 'laydate'], function() {
		var $ = layui.jquery,
			layer = layui.layer,
			table = layui.table,
			sidebar = layui.sidebar,
			form = layui.form,laydate = layui.laydate;
	var  tablesearchidval = ''

	var  itemjson = {
		search:'',
				startTime:'',
				stopTime:''
				
	}
		//第一个实例
		var typetable = table.render({
			size: 'lg',
			where:itemjson,
			contentType: 'application/json',
			pageSize: 20,
			elem: '#demo_hash',
			// toolbar: '#toolbarDemo',
			height: '',
			url: HH_URL + hhSourceGet, //数据接口
			page: true, //开启分页
			even: true,
			skin: 'nob',
			cellMinWidth: 100,
			cols: [
				[ //表头
					{
						type: 'numbers'
					},
					{
						field: 'tbId',
						title: 'ID',
						hide: true,
					},  {
						field: 'tbSourceName',
						title: '名称',
							sort:true
					}, {
						field: 'tbSourceUrl',
						title: '链接',
						width: 300,
							sort:true
					},
					{
						field: 'userNumber',
						title: '用户数量',
						width: 120,
							sort:true
					},{
						field: 'createTime',
						title: '创建时间',
						width: 200,
							sort:true
					}, {
						title: '操作',
						fixed: 'right',
						width: 180,
						toolbar: '#barDemo_hash'
					}
				]
			],

			done: function(res, curr, cont) {
				// console.log(res)
				table.render()
				form.render()
	
				laydate.render({
					elem: '#datavideo' //指定元素
						,
					range: true,
					done: function(value, date, endDate) {
						console.log(date.length)
						if(date.year == undefined){
							itemjson.startTime = '';
								itemjson.stopTime = '';
						
						}else{
							itemjson.startTime = date.year + '-' + date.month + '-' + date.date;
							itemjson.stopTime = endDate.year + '-' + endDate.month + '-' + endDate.date;
						}
					
						typetable.reload({
							where:itemjson,
							page: {
								curr: 1 //重新从第 1 页开始
							}
						
						});
						// getvideofn(itemjson);
					}
				});

			
				$('#tablesearchid').keydown(function(event) {
						itemjson.search = $('#tablesearchid').val();
					if (event.keyCode == 13) {
						typetable.reload({
							where:itemjson,
							page: {
								curr: 1 //重新从第 1 页开始
							}
						
						});

					}
				})
			}
		});
		
	$("#addtypeid").on('click',function(){
		lookfn('添加来源', '请输入来源名称', '', function(pass, index) {
			POSTAJAX(hhSourceAdd, {
				tbName: pass
			}, function(res) {
				layer.msg(res.msg);
				typetable.reload('demo_hash');
			})
		})
	})
		
		//监听事件
		table.on('toolbar(type_hash)', function(obj) {
			var checkStatus = table.checkStatus(obj.config.id);
			var data = obj.data; //获得当前行数据
			var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var tr = obj.tr; //获得当前行 tr 的DOM对象
			switch (layEvent) {
				case 'delallbtn':
					//批量删除行数
					// console.log(checkStatus.data);
					var tbarray = [];
					$.each(checkStatus.data, function(idx, obj) {
						tbarray.push(obj.tbId);
					})

					layer.confirm('确认删除所选中行的数据吗?', function(index) {
						POSTAJAX(hhSourceDel, {
							ids: tbarray
						}, function(res) {
							layer.close(index);
							layer.msg(res.msg);
							if (res.status == 200) {
								typetable.reload('demo_hash');
							}
						})
						//向服务端发送删除指令
					});

					break;
				case 'addbtn':
					lookfn('添加来源', '请输入来源名称', '', function(pass, index) {
						POSTAJAX(hhSourceAdd, {
							tbName: pass
						}, function(res) {
							layer.msg(res.msg);
							typetable.reload('demo_hash');
						})
					})
					break;
				default:

					break;
			}
		});

		//监听工具条
		table.on('tool(type_hash)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
			var data = obj.data; //获得当前行数据
			var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var tr = obj.tr; //获得当前行 tr 的DOM对象
			switch (layEvent) {
				case 'look':
					layer.msg(JSON.stringify(obj.data));
					break;
				case 'del':
					delfn({
						ids: [obj.data.tbId]
					}, obj);

					break;
				case 'edit':
					lookfn('修改来源', '请输入来源名称', obj.data.tbSourceName, function(pass, index) {
						POSTAJAX(hhSourceMod, {
							tbName: pass,
							tbId: obj.data.tbId
						}, function(res) {
							layer.msg(res.msg);
							typetable.reload('demo_hash');
						})
					})
					break;

				default:

					break;
			}

		});




		function delfn(tdata, obj) {
			layer.confirm('确认删除该来源吗?', function(index) {
				POSTAJAX(hhSourceDel, tdata, function(res) {
					layer.close(index);
					layer.msg(res.msg);
					if (res.status == 200) {
						obj.del(); //删除对应行（tr）的DOM结构，并更新缓存

					}

				})

				//向服务端发送删除指令
			});
		}


		function lookfn(Ttitle, placeholdertxt, value, callback) {
			// 查看来源名称进行修改/添加
			layer.prompt({
					title: Ttitle,
					formType: 0,
					value: value,
					tiptxt: '请文明' + Ttitle,
					btntips: '一经发现违法，平台有权对其删除',
					placeholdertxt: placeholdertxt,
					btn: [Ttitle],
				},
				function(pass, index) {
					layer.close(index);
					callback(pass, index)
				});
		}

		$('#search_hash').on('click', function() {
			var that = this;
			// console.log($('#search_tpl_hash').html());
			sidebar.render({
				elem: that,
				content: $('#search_tpl_hash').html(),
				title: '搜索',
				shade: true,
				// shadeClose:false,
				// direction: 'left'
				// dynamicRender: false,
				// url: 'views/member/all/search.html',
				width: '500px', //可以设置百分比和px
				done: function() {
					console.log('ccc');
					form.render();

					//监听提交
					form.on('submit(formDemo_hash)', function(data) {
						// layer.msg(JSON.stringify(data.field));
						table.reload('demo_hash', {
							where: data.field
						});
						return false;
					});
				}
			});
		});
	});
</script>

<style scoped>

</style>
